<template>
  <div id="app3">
    <header class="header">
      <div class="title">
        <!-- <router-link to="/xqda">
            <img src="../assets/images/01_11.png" alt="" class="img_zuo" />
          </router-link> -->

        <div>消息</div>
      </div>
    </header>
    <div class="main">
      <div class="top">
        <div class="ju" @click="by" v-if="stat.length!==0">
          <img src="../assets/images/img/quanxuan.png" alt="" />
          <div>本页已读</div>
        </div>
        <div class="ju" v-if="list.length == 0">
          <div>暂无消息</div>
        </div>
      </div>
      <!-- 隐患 -->
      <div class="list">
        <van-list v-model="loading" :finished="finished" @load="onLoad">
          <van-swipe-cell
            v-for="(item, index) in list"
            :key="index"
            :finished="finished"
            class="li"
          >
            <div class="liebiao" @click.stop="ct(item)">
              <div class="liebiaoimg">
                <img src="../assets/images/img/b5.png" alt=""  v-if="item.informationTypeId==1"/>
                 <img src="../assets/images/img/b1.png" alt=""  v-if="item.informationTypeId==3"/>
                  <img src="../assets/images/img/b5.png" alt=""  v-if="item.informationTypeId==2"/>
                   <img src="../assets/images/img/b10.png" alt=""  v-if="item.informationTypeId==4"/>
                   
              </div>
              <div class="liebiaotext">
                <div class="titles">
                  <div class="bt">{{ item.title }}</div>
                  <div>{{ item.time }}</div>
                </div>
                <div class="detail">
                  <!-- 您有<span>1</span>条即将超期未整改隐患，点击查看 -->
                  {{ item.content }}
                </div>
              </div>
              <div class="weidu" v-if="item.status == 2">
                <img src="../assets/images/img/weidu.png" alt="" />
              </div>
            </div>

            <template #right class="right">
              <van-button
                square
                text="删除"
                type="danger"
                class="delete-button"
                @click="getCode(item)"
              />
            </template>
          </van-swipe-cell>
        </van-list>
      </div>
    </div>
    <Tabbar></Tabbar>
  </div>
</template>
<script>
import Header from "../components/header";
import Tabbar from "../components/tabbar";
import { Dialog } from "vant";
export default {
  data() {
    return {
      active: 0,
      icon: {
        active: require("../assets/images/tabbar_home_active.png"),
        inactive: require("../assets/images/tabbar_home.png"),
      },
      icon2: {
        active: require("../assets/images/tabbar_msg_active.png"),
        inactive: require("../assets/images/tabbar_msg.png"),
      },
      icon3: {
        active: require("../assets/images/call_active.png"),
        inactive: require("../assets/images/call.png"),
      },
      icon4: {
        active: require("../assets/images/tabbar_user_active.png"),
        inactive: require("../assets/images/tabbar_user.png"),
      },
      userId: "",
      list: [],
      count: 1,
      code: 200,
      loading: false,
      refreshing: false, //是否下拉加载 是true
      total: "",
      finished: false,
      // by:false,
      dx: {},
      stat:[],
    };
  },
  components: {
    Header,
    Tabbar,
  },
  //进入该页面时，用之前保存的滚动位置赋值
  //  beforeRouteEnter(to, from, next) {
  //    next((vm) => {
  //      vm.();
  //    });
  //  },
  created() {
    this.userId = localStorage.getItem("userId"); //获取访问id
    
  },
  methods: {
    // 请求列表
    onLoad() {
       this.info();
    },

    // scrollTop() {
    //   var list_scrollTop = localStorage.getItem("list_scrollTop")
    //     ? JSON.parse(localStorage.getItem("list_scrollTop"))
    //     : null;
    //   if (list_scrollTop || list_scrollTop === 0) {
    //     $(".li").animate(
    //       {
    //         scrollTop: list_scrollTop,
    //       },
    //       0
    //     );
    //   }
    // },
     onRefresh() {
      // 清空列表数据

      this.finished = false;

      // 将 loading 设置为 true，表示处于加载状态
      this.loading = true;
      this.list = [];
            this.count = 1;
      this.refreshing = false;

      this.onLoad();
    },
    info() {
      //获取数据
      // try {
      //   plus.nativeUI.showWaiting("正在加载...");
      // } catch (e) {
      //   console.log("plus问题");
      // }
      this.axios
        .get(
          `${this.$global_msg.Url.host}/Information/selectInformation?userId=${this.userId}&page=${this.count}&num=10`
        )
        .then((res) => {
          console.log(res);

          if (this.refreshing) {
            this.list = [];
            this.refreshing = false;
            this.count = 1;
          }
          if (res.data.code == 200) {
            var arr = [];
           
            var lislength = res.data.rows.list;
            for (let i = 0; i < lislength.length; i++) {
              // console.log(res.data.rows.list[i].status);
              if (lislength[i].status == 2) {
                arr.push(lislength[i].id);
                 this.stat.push(lislength[i].status);
              }
             
               
              
            }
            if (arr.length == 0) {
              $("#app3").css("height", "1px");
              $(".main").css("padding-bottom", "0rem");
            }

            
          
            this.dx = arr.join();

             console.log(this.stat);
            if (res.data.rows.total == 0) {
              this.finished = true;
              return false;
            }
            for (var i of res.data.rows.list1) {
              this.list.push(i);
            }
            this.total = res.data.rows.total;
            this.count += 1;
            this.loading = false;
            if (
              this.total < this.list.length ||
              this.total == this.list.length
            ) {
              this.finished = true;
              console.log("加载完毕");
            }
          } else {
            this.$toast("暂无数据");
          }
        }).catch( err=>{
            this.$terminal._error(err)
        })
    },
    // 删除
    getCode(item) {
      Dialog.confirm({
        title: "提示",
        message: "确定要删除吗？",
      })

        .then(() => {
          // on cancecl
          console.log(item.id);
          var id = item.id;
          this.axios
            .get(
              `${this.$global_msg.Url.host}/Information/deleteInformation?id=${id}`
            )
            .then((res) => {
              if (res.data.code == 200) {
                this.$router.go(0);
              }else{
                this.$toast(res.data.msg)
              }
              //
            }).catch( err=>{
              this.$terminal._error(err)
          })
        })
        .catch((err) => {
          this.$terminal._error(err)
        });
    },

    //  跳转详情
    ct(item) {
      //
      this.axios
        .get(
          `${this.$global_msg.Url.host}/Information/updateInformation?id=${item.id}`
        )
        .then((res) => {
          if (res.data.code == 200) {
            localStorage.setItem(
              "yh_detail_patrolTroubleshootId",
              item.patrolTroubleshoot
            );
            localStorage.setItem(
              "yh_detail_patrolTroubleshootInfoId",
              item.patrolTroubleshootInfoId
            );
            localStorage.setItem("list_scrollTop", $(".li").scrollTop());
           
            if(item.informationTypeId==1){
              // 隐患整治
 this.$router.push("/yhzz_detail");
            }else if(item.informationTypeId==3){
              // 监督检查计划
              if(item.supervisionExamineType==2||item.supervisionExamineType==1){
 
         var jdjc_jcdx_params = {
            id:item.supervisionExaminePlanDetailId,
            roomId:item.supervisionExamineUnitId,
            type:item.supervisionExamineType
          };
          localStorage.setItem("jdjc_jcdx_params",JSON.stringify(jdjc_jcdx_params));
          this.$router.push("/jdjc_jcdx");
              }else if(item.supervisionExamineType==3){
                 var info={
          active:2,
          jd:item.supervisionExamineUnitId,
        }
        localStorage.removeItem("list_scrollTop");
                  sessionStorage.setItem("jdjc_table_active",JSON.stringify(info))
          this.$router.push("/jdjc_wd");
              }
            }else if(item.informationTypeId==2){
// 三年行动
localStorage.setItem("logid",item.threeYearActionLogId)
 this.$router.push("/snxd_detail");
            }else if(item.informationTypeId==4){
              // 任务交办
this.$router.push({
        path: '/ckrw',
        query: { id:item.taskAssignId}
      });
            }
          }else{
            this.$toast(res.data.msg)
          }
        }).catch( err=>{
            this.$terminal._error(err)
        })
    },
    //点击全部
    by() {
      this.axios
        .get(
          `${this.$global_msg.Url.host}/Information/updateInformation?id=${this.dx}`
        )
        .then((res) => {
          console.log(res);
          if (res.data.code == 200) {
            this.$router.go(0);
           
            $(".top").hide();
          }else{
            this.$toast(res.data.msg)
          }
        }).catch( err=>{
            this.$terminal._error(err)
        })
    },
  },
  mounted() {
    document.body.style.backgroundColor = "white";
  },
};
</script>
<style scoped>
#app3 {
  background: #f1f1f1;
}
body {
  margin: 0;
  background: #dddddd;
}
.main {
  margin-top: 1.9rem;
  padding-bottom: 1.5rem;
}
.liebiao {
  width: 94%;
  margin: auto;
  display: flex;
  margin-top: 0.3rem;
  position: relative;
  background: #fff;
  border-radius: 11px;
}
.bt {
  font-size: 0.3833333rem;
}
.liebiaoimg {
  width: 16%;
}
.liebiaoimg img {
  width: 100%;
}
.liebiaotext {
  width: 76%;
}
.titles {
  display: flex;
  justify-content: space-between;
  padding-bottom: 0.3rem;
  padding-top: 0.3rem;
}
.weidu {
  position: absolute;
  width: 7%;
  right: 0px;
}
.weidu img {
  width: 100%;
  position: relative;
}
.detail {
  font-size: 0.332222rem;
  padding-bottom: 0.3rem;
}
.ju {
  width: 30%;
  margin: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.ju img {
  width: 14%;
  margin-top: 3px;
}
.ju div {
  color: #2d9dfe;
}
.van-tabbar {
  padding: 0.4rem 0;
}
.van-tabbar--fixed {
  position: fixed;
  bottom: 0;
  left: 0;
  background: #ffffff;
}
.van-tabbar--fixed {
  border-top: 1px solid #cccccc;
  /* border: none; */
  padding-top: 0.8rem;
}
.van-tabbar-item {
  font-size: 0.44rem;
  line-height: 0.6rem;
}
.van-tabbar-item__icon img {
  display: block;
  height: 0.5333rem;
}
[class*="van-hairline"]::after {
  border: none;
}
.header {
  height: 1.8519rem;
  background: url(../assets/images/home_bg.png) no-repeat;
  background-size: 100% 100%;
  padding-top: 0.8333rem;
  box-sizing: border-box;
  position: fixed;
  width: 100%;
  top: 0;
  z-index: 20;
  font-size: 0.388888rem;
}

.title {
  padding: 0 0.3704rem;
  display: flex;
  align-items: center;
  color: #fff;
}

.title > div {
  width: 100%;
  font-size: 0.4444rem;
  text-align: center;
}

.img_zuo {
  width: 0.2593rem;
  height: 0.463rem;
}

.van-swipe-cell__right {
  position: absolute;
  top: 0;
  height: 100%;
  width: 34% !important;
  right: 0.5rem !important;
}
.van-button--danger {
  color: #fff;
  background-color: #ee0a24;
  height: 1.8rem;

  border: 0.009259rem solid #ee0a24;
}
</style>